<template>
	<view class="content pc-tou-gao " >
		<Dzhifu
		:show="show"
		:payType="payType"
		:jine="jine"
		@close="show = false"
		@uidapi="getUid_api"

		></Dzhifu>
		<view class="scroll-fix" >
			<view class="d-kuan-juzhong ">
				<!--头部-->
				<view class="d-kuan pc-dingbu ">
					<DToubu 
					ref="dToubu"
					@login-success="handleLoginSuccess" 
					@logout-success="handleLogout"
					:dengluxianshi="denglu_xianshi"
					@update-dengluxianshi="handleUpdateDengluxianshi"
					:title="quan_data.title || '选择圈子'"
					></DToubu>
				</view>

				<!--头部-->
				<!--下面内容-->
				<view class="d-kuan d-clear">
					<uv-row customStyle="margin-bottom: 10px" :gutter="10">
						<uv-col span="2" class="pc-yincang">
							<!--左边导航-->
							<view class="d-daohang d-you-10 pc-yincang d-y-gundong d-shang-20" id="zuo-daohang" :style="{height: leftNavHeight}">
								<view class="d-daohang-5 " >
									<Ddaohang @denglu-fabu="denglu_fabu"></Ddaohang>
								</view>
							</view>
						</uv-col>
						<uv-col :span="kuan_shu" class="d-quan-0" style="position: relative; display: flex; flex-direction: column; min-height: 100vh;">
					
							<!--圈子背景-->
					            <view class="pc-neikuang-20-list " >
									<view class="d-kuan   d-fu-shang-10 d-yuanjiao-20-20" :style="{opacity: dataLoaded ? '1' : '0', transition: 'opacity 0.5s ease-in-out'}">
										<view class="d-fu-zuoyou-10">
											<view class=" relative d-yuanjiao-20-20" style="background-image: url('/static/img/beijing000.jpg'); background-size: cover; background-repeat: no-repeat; background-position: center;">
												<view class="d-kuan ">
													<view class="d-neikuang-10 ">
														<view class="d-fanhui-40 d-shang-10" @click="fanhui">
															<uv-icon name="arrow-left" color="#ffffff" size="18"></uv-icon>
														</view>
													</view>
												</view>
												<view class="d-kuan d-buhuanhang">
													<view class="d-kuang-100 d-shangxia-juzhong d-zuo-20 d-yuanjiao-50">
														<image :src="quan_data.tubiao" class="d-yuanjiao-50" style="width: 50px; height: 50px;" mode="aspectFill"></image>

														 
													</view>
													<view class="d-kuan " style="margin-top: 23px;">
														<view class="d-wenzi-yanse-bai-0 d-jiacu d-zuo-10">{{  quan_data.title }}</view>
							
														<view class="d-shang-5 d-wenzi-yanse-bai-0 d-buhuanhang">
															<view class="d-shang-5 d-zuo-5"> <uv-icon name="account" color="#ffffff" labelColor="#ffffff" size="20" :label="quan_data.name"></uv-icon> </view>
															<!--view class="d-shang-5 d-zuo-10"> <uv-icon name="heart" color="#ffffff" labelColor="#ffffff" size="26" :label="'粉丝：'+jiaquan_shu"></uv-icon> </view-->

														</view>
														<!--view class="d-kuan d-shang-5">
															 
															<uv-avatar-group :urls="quan_data.touxiang" size="24" gap="0.3"></uv-avatar-group>

														</view-->
														<!--view class="d-shang-5 d-buhuanhang d-wenzi-yanse-bai-0"> 
															<uv-icon name="file-text" color="#ffffff" labelColor="#ffffff" size="26" ></uv-icon>
															 {{  quan_data.jianjie }} 
														</view-->
													</view>
													<view class="d-kuang-100 d-shangxia-juzhong d-you-20">
														<view v-if="quan_data.jiage > 0">
															 
															<view v-if="jiaquan_panduan==0" class="d-kuang-30-100 " >{{quan_data.jiage}}元 </view>
															<view v-if="quan_data.uid == uid">
																<view class="d-kuang-30-100 d-beijing-lvse-1" @click="edit_url">管理</view>
															</view>
															<view v-else>
																<view v-if="jiaquan_panduan==0" class="d-kuang-30-100 d-beijing-lvse-1" @click="goumai(id)">购买</view>
																<view v-else-if="jiaquan_panduan==1" class="d-kuang-30-100 d-beijing-lvse-2" >已加入</view>
															    <view v-else class="d-kuang-30-100 d-beijing-lvse-1" @click="jiaquan(id)">+加入</view>
															</view>

															 
															 
														</view>
														<view v-else>
															<view v-if="quan_data.uid== uid" class="d-kuang-30-100 d-beijing-lvse-1" @click="edit_url">管理</view>
															<view v-else-if="jiaquan_panduan==0" class="d-kuang-30-100 d-beijing-lvse-1" @click="jiaquan(id)">+加入</view>
														    <view v-else-if="jiaquan_panduan==1" class="d-kuang-30-100 d-beijing-lvse-2" @click="jiaquan(id)">已加入</view>
															<view v-else class="d-kuang-30-100 d-beijing-lvse-1" @click="jiaquan(id)">+加入</view>
														</view>
													</view>
												</view>
												<view class="d-clear"></view>
												<view class="d-kuan d-clear d-shang-20" >
													<view class="">
														<uv-grid :col="4"  :border="true">
												    	    <uv-grid-item v-for="(item,index) in baseList" :key="index">
																<uv-icon v-if="index==0" :customStyle="{paddingTop:20+'rpx'}" color="#ffffff" labelColor="#ffffff" :label="jiaquan_shu" :size="22"></uv-icon>
															    <uv-icon v-if="index==1" :customStyle="{paddingTop:20+'rpx'}" color="#ffffff" labelColor="#ffffff" :label="quan_data.tieshu" :size="22"></uv-icon>
												    	        <uv-icon v-if="index==2" :customStyle="{paddingTop:20+'rpx'}" color="#ffffff" labelColor="#ffffff" :label="quan_data.tianshu" :size="22"></uv-icon>
												    	        <uv-icon v-if="index==3" :customStyle="{paddingTop:20+'rpx'}" color="#ffffff" labelColor="#ffffff" :label="quan_data.comments" :size="22"></uv-icon>
												    			<text class="grid-text d-zitiyanse-bai d-shang-10">{{item.title}}</text>

												    		</uv-grid-item>

												    	</uv-grid>
														<view class="d-clear d-kuan" style="height: 30px;"></view>
													</view>
													<view class="d-clear"></view>
												
												</view>
												<view class="d-clear"></view>
												<view class="d-kuan">
													<view style="margin: 0px  20px;padding-bottom: 10px;">
														<uv-search :showAction="true" :clearabled="true" actionText="搜索" bgColor="#e8e8e80f" color="#ffffff" @search="handleSousuo" @input="handleSousuo" v-model="search" placeholderColor="#d8d0ef" :animation="true" customStyle="backgroundColor: rgb(249 249 249 / 1%);borderRadius: 50px;"></uv-search>
													</view>		
												</view>
												 
											</view>
										</view>
										 
										<view class="d-kuan d-buhuanhang d-shang-5">
											<view class="d-zuo" style="width: 100%;">
												<uv-tabs :list="quan_list" lineColor="#000000"  @click="quan_click"></uv-tabs>
											</view>
											 
											<view v-if="quan_data.kaifangfabu == 1" class="d-you pc-yincang">
												<view v-if="jiaquan_panduan==1" style="margin-top: 8px;" class="d-kuang-30-100 d-beijing-lvse-3 d-you d-you-10 d-shang-8" @click="fabu(id,quan_data.title)">发布</view>
											</view>
											<view v-else-if="quan_data.kaifangfabu == 0 && quan_data.uid == uid" class="d-kuan">
												<view style="margin-top: 8px;" class="d-kuang-30-100 d-beijing-lvse-3 d-you d-you-10 d-shang-8" @click="fabu(id,quan_data.title)">发布</view>
											</view>

										</view>
										 
									</view>
									
							</view>
							
							<view class="pc-neikuang-20" >
								<view class="d-clear"></view>
								<view v-if="uid && !search"  class="d-kuan d-beijing-baise d-yuanjiao-10 ">
									<view class="d-neikuang-10 ">
										<view class="d-zuo"></view>
										<view class="d-you">
											<text>余额： {{ uid_data.money }} </text>
											<text class="d-zuo-10" @click="show = true">充值</text>
										</view>
										<view class="d-clear"></view>
									</view>
								</view>
								<!--审核按钮-->
									<view v-if="shenhe_shu > 0" class="d-kuan ">
										<view class="d-neikuang-10">
										    <uv-button @click="shenhe" type="primary" size="small" iconColor="#ffffff" icon="chat" shape="circle" color="linear-gradient(to right, rgb(59, 216, 169), rgb(46, 127, 213))" :text="'新贴审核('+shenhe_shu+')'"></uv-button>
										</view>
									</view>
								<!--帖子列表-->
								<view v-if="shuxing == 0 && !search" class=" d-beijing-baise d-yuanjiao-10 d-bianhua-10 d-shang-10">
									<uv-read-more show-height="200rpx" textIndent="0" :toggle="true" color="#a2a2a2" ref="readMore">
										<view class="">
											<view class="d-jiacu">《{{quan_data.title}}》圈子介绍</view>
											<view class="d-wenzi-14 d-shang-10" style="line-height: 1.6;">
												<view >{{quan_data.title}} 圈子 创建于 {{quan_data.fabushijian}} 。至今已经 {{quan_data.tianshu}} 天</view>
												<uv-parse :content="quan_data.neirong_data" :selectable="true" @ready="ready"></uv-parse>
												
											</view>
										</view>
									</uv-read-more>
								</view>
								<view v-if="shuxing == 3 && !search" class=" d-beijing-baise d-yuanjiao-10 d-bianhua-10 d-shang-10">
									<view class="d-zuoyou-neikuang-10 ">
										<view class="d-jiacu">购买必知</view>
										<view v-if="quan_data.jiage > 0" class="">
										<view>{{quan_data.title}} 是 付费圈子。</view>
										<view class="d-shangxia-5">1.《{{ quan_data.title }}》为“音频+图文”内容；包含授课音频、完整文稿以及学员问答。</view>
										<view class="d-shangxia-5">2.本圈子为付费圈子，购买成功后，即可再有效期内使用该圈子所有内容。</view>
										<view class="d-shangxia-5">3.本圈子为虚拟内容服务，一经购买成功，概不退款，请你理解。</view>
										</view>
										<view v-else >
											<view>{{quan_data.title}} 是 免费圈子。</view>
										</view>
										
									</view>
								</view>
								<view class="d-clear"></view>
								<view class="d-kuan d-beijing-baise d-yuanjiao-10 d-shang-10">
									<view class="d-neikuang-10 ">
									    <uv-tabs :list="list_shuxing" lineColor="#02c7b6" @click="click_suxing" :itemStyle="{ height: '44px',color:'#2daf99',fontSize: '20px'}"></uv-tabs>
									</view>
								</view>
								<view class="d-clear"></view>
								<!--内容-->
									<uv-row customStyle="flex-wrap: wrap" :gutter="20" wrap>
										<uv-col v-for="(tie,index) in tiezi_list" span="12" >
											<view class="d-waigao-20 d-beijing-baise d-yuanjiao-10 d-bianhua-10" style="position: relative;">
												<!--推荐-->
												<view v-if="tie.quanneituijian == 1 || tie.quanzhantuijian ==1 " class="d-tuijian-1" style="position: absolute; top: 10px; right: 10px; z-index: 1;">
													<image src="/static/images/tui.png" mode="aspectFill" class="d-img-50"></image>
												</view>
												<!--头像-->
												<view class="d-kuan ">
													<view class="d-baifen-50 d-zuo d-buhuanhang">
														<view class="d-gaokuang-40 d-kuanggao-40 d-yuanjiao-40 d-box" @click="getgeren(tie.uid)">
														    <image v-if="tie.touxiang" :src="tie.touxiang" mode="aspectFill" class="d-img-40 d-yuanjiao-50 d-beijing-hui d-img-anhei"></image>
															<image v-else src="/static/assets/images/avatar.png" mode="aspectFill" class="d-img-40 d-yuanjiao-50 d-beijing-hui d-img-anhei"></image>
														</view>
														<view class="d-kuan d-zuo-10" @click="getgeren(item.uid)">
															<view class="d-wenzi-14 d-jiacu d-wenzi-hei">{{ tie.mingcheng }} </view>
															<view class="d-wenzi-14 d-wenzi-yanse-hui d-chaochu-1">{{ tie.fabushijian }}</view>
														</view>
													</view>
													<view class="d-baifen-50 d-you">
														<view class=" d-neirong-you d-you" >
															<!--view v-if="denglu_xianshi == 1" @click="getGuanzhus(index,item.uid)" class="d-you d-kuan-40 d-beijing-hei d-wenzi-yanse-bai-0 d-neikuang-zuoyou-2-shangxia-4 d-wenzi-12 d-yuanjiao-50 d-neirong-juzhong" >已关注</view>
															<view v-else @click="getGuanzhus(index,item.uid)" class="d-kuan-40 d-beijing-hui-f6 d-wenzi-hei d-neikuang-zuoyou-2-shangxia-4 d-wenzi-12 d-yuanjiao-50 d-neirong-juzhong" >关 注</view-->
														</view>
													</view>
												</view>
												<view class="d-clear"></view>
												
												<!--内容-->
												<view class="d-zuoyou-neikuang-10 ">
													<!--标题-->
													<view 
														class="d-jiacu d-shang-10 d-wenzi-16 d-xia-10 d-younei-10  d-wenzi-hei d-jiacu" 
														@click="tiezi(tie.cid,tie.id)"
													>{{ tie.title }}</view>
													<!--进度-->
													<view v-if="tie.jindu && tie.jindu.jindu == 1" class="d-kuan" @click="tiezi(tie.cid,tie.id)">
														<uv-steps :current="tie.jindu && tie.jindu.zhuangtai" class="d-shang-20">
															<uv-steps-item title="已准备" customStyle="font-size: 12rpx;" :desc="tie.jindu && tie.jindu.tianjiashijian"></uv-steps-item>
															<uv-steps-item title="进行中" :desc="tie.jindu && tie.jindu.kaishishijian"></uv-steps-item>
															<uv-steps-item title="已完成" :desc="tie.jindu && tie.jindu.jieshushijian"></uv-steps-item>
														</uv-steps>
													</view>
													<!--内容-->
													<view 
													    class="d-wenzi-12 d-wenzi-yanse-hui d-shang-10 d-xia-10 d-younei-10  d-chaochu-3"
													    @click="tiezi(tie.cid,tie.id)"
													>
														{{ tie.jianjie }}
													</view>
													<!--图片-->
													<view class="d-fu-kuan-10 d-buhuanhang" @click="tiezi(tie.cid,tie.id)">
														<block v-for="(itemtu, indextu) in tie.tupian" :key="indextu">
																<view class="d-kuan-30 d-zuo d-liangbian-10" v-if="indextu < 3">
																	<image :src="itemtu" mode="aspectFill" class="d-img-100-bai d-yuanjiao-6 d-yinying-10 d-img-anhei"></image>
																</view>
															<!--view class="d-kuan-30 d-zuo d-liangbian-10" v-if="indextu < 9">
																<image :src="itemtu" mode="aspectFill" class="d-img-100-bai d-yuanjiao-6 d-yinying-10 d-img-anhei"></image>
															</view-->
														</block>


														<view class="d-clear"></view>
													</view>
													<view class="d-clear"></view>
												<!--音频-->
												<NlAudioPlayer
												    :id="'yinpin_'+index"
												    v-if="tie.yinpin && tie.yinpin[0]"
													:src="tie.yinpin && tie.yinpin[0]"
													style="margin: 20px 0;"
													:bar-bg-style="{ borderRadius: '50px' }"
													:bar-style="{ backgroundColor: '#27a393', borderRadius: '50px' }"
													:dot-style="{ width: '30rpx', height: '30rpx', backgroundColor: '#2ebdac' }"
													:ref="el => this.setAudioRef(el, index)"
													@play="onAudioPlay(index)"
												></NlAudioPlayer>
												<!--视频-->
												<view v-if="tie.shipin_kaiguan == 1 && tie.shipin && tie.shipin[0] && tie.shipin[0].shipin" class="d-shang-10">
													<video 
														class="d-yuanjiao-10 d-kuan d-video-height"
														:src="tie.shipin && tie.shipin[0] && tie.shipin[0].shipin"
														:poster="tie.shipin && tie.shipin[0] && tie.shipin[0].shipintu" 	
														controls
													ref="videoPlayer">
													</video>
												</view>

													<!--评论-->
													<view class="d-kuan d-shang-10">

														<view class="">
															<uv-row customStyle="flex-wrap: wrap" :gutter="20" wrap>
																<uv-col span="3" >
																	<view class="d-biaoqian">
																		<uv-tags 
																		:text="tie.quanzi.slice(0, 2)" 
																		size="mini"
																		type="success" 
																		shape="circle" 
																		icon="tags-fill" 
																		plain 
																		plainFill
																		bgColor="#ffffff"
																		borderColor="#02c7b6"
																		color="#02c7b6"
																		iconColor="#02c7b6"
																		></uv-tags>
																	</view>

																</uv-col>
																<uv-col span="6"   @click="tiezi(tie.cid,tie.id)">
																	<uv-row customStyle="flex-wrap: wrap" :gutter="20" wrap>
																		
																		<uv-col span="4" >
																			<uv-icon name="heart" color="#bbbbbb" size="18" :label="tie.shoucang" labelColor="#bbbbbb"></uv-icon>
																		</uv-col>
																		<uv-col span="4">
																		    <uv-icon name="chat" color="#bbbbbb" size="18" :label="tie.pinglun" labelColor="#bbbbbb"></uv-icon>
																		</uv-col>
																		<uv-col span="4" >
																			<uv-icon name="thumb-up" color="#bbbbbb" size="18" :label="tie.dianzan" labelColor="#bbbbbb"></uv-icon>
																		</uv-col>
																	</uv-row>

																</uv-col>
																<uv-col span="3" customStyle="display: flex; justify-content: flex-end; " @click="tiezi(tie.cid,tie.id)">
																	<view class="d-kuan" style="display: flex; justify-content: flex-end; ">
																		<uv-avatar-group :urls="tie.dianzan_touxiang" size="22" gap="0.4"></uv-avatar-group>
																	</view>
																</uv-col>
															</uv-row>
														</view>
													</view>
												</view>
											</view>

										</uv-col>
										<!-- 加载状态提示 -->
										<view class="d-kuan d-juzhong d-shangxia-20" v-if="isLoading">
											<uv-loading-icon></uv-loading-icon>
  										</view>
  										<view class="d-kuan d-juzhong d-shangxia-20 d-wenzi-hui" v-if="noMoreData">
  										    <uv-divider text="没有更多数据了"></uv-divider>
											  <uv-gap height="150" bgColor="#bbb"></uv-gap>
  										</view>
										
									</uv-row>
							</view>
							

							<!--付费-固定在底部不滚动，从左侧开始-->
							
						</uv-col>
						<uv-col span="3" class="pc-yincang">
							<view class="d-daohang d-you-10 pc-yincang d-shang-20" id="zuo-daohang" :style="{height: leftNavHeight}">
								<view class="d-you-kuang">
									<view class="d-kuan  " id="yuedu_gao" :style="{height: leftNavHeight,width: rightColWidth,marginTop: '10px'}">
										<view class=" gundong-2"  style="height: 100%; display: flex; flex-direction: column;overflow-y: auto;">
											<view class="d-yuanjiao-10  d-beijing-e3 d-bianhua-10 ">
												<view class="d-kuan d-jiacu d-wenzi-16">
													站点资讯
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						
					</uv-col>
				</uv-row>
					

				</view>
				<!--下面内容-->


			</view>

			<view class="d-clear"></view>
			
		
		</view>
		
		<view v-if="quan_data.jiage > 0 && jiaquan_panduan == 0 " style="position: fixed; bottom: 0; width: 100%; z-index: 999; background-color: #f3f3f3; ">
			<view class="d-kuan-juzhong">
				<view class="d-kuan d-clear">
					<uv-row customStyle="" :gutter="10">
						<uv-col span="2" class="pc-yincang">
							<view></view>
						</uv-col>
						<uv-col :span="kuan_shu">
							<view class="pc-neikuang-20">
								<view class="d-kuan  " style="display: flex; justify-content: space-around; ">
									<!--view class="d-wenzi-16" style="flex: 1; display: flex; align-items: center; justify-content: center;">
											<uv-icon name="server-fill" color="#595d5f" size="28" label="客服"></uv-icon>
									</view-->
									<view class="d-wenzi-14" style="flex: 1; display: flex; align-items: center; justify-content: center;color: #595d5f; background-color: #f3f3f3;">
										<uv-icon name="clock" color="#595d5f" size="28" :label="quan_data.huiyuan_tianshu+'天'"></uv-icon>
										( {{quan_data.kaishishijian}} ~ {{quan_data.jieshushijian}} ) 有效期
									</view>
							    </view>
							    <view class="d-kuan d-wenzi-16" >
									<uv-button 
										@click="goumai(id)" 
										shape="circle" 
										color="linear-gradient(to right, rgb(24, 216, 200), rgb(213, 51, 186))" 
										type="primary" 
										size="normal" 
										:text="'立即加入圈子'+quan_data.jiage"
									>
									</uv-button>
								</view>

							</view>
							
						</uv-col>
						<uv-col span="3" class="pc-yincang">
							<view></view>
						</uv-col>
				</uv-row>

				</view>
				

			</view>
		</view>
		<view v-else-if="jiaquan_panduan == 1 && quan_data.kaifangfabu == 1 || quan_data.uid == uid" style="position: fixed; bottom: 0; width: 100%; z-index: 999; background-color: #f3f3f3; ">
			<view class="d-kuan-juzhong">
				<view class="d-kuan d-clear">
					<uv-row customStyle="" :gutter="10">
						<uv-col span="2" class="pc-yincang">
							<view></view>
						</uv-col>
						<uv-col :span="kuan_shu">
							<view class="">
								
							    <view class="d-kuan d-wenzi-16" >
									<uv-tabbar :value="quan_value" activeColor="#000000">
										
										<uv-tabbar-item  text="发布" icon="plus-circle" @click="fabu(id,quan_data.title)"></uv-tabbar-item>
									</uv-tabbar>
								</view>
		
							</view>
							
						</uv-col>
						<uv-col span="3" class="pc-yincang">
							<view></view>
						</uv-col>
				</uv-row>
		
				</view>
				
		
			</view>
		</view>
		<view v-else-if="jiaquan_panduan == 0 && quan_data.kaifangfabu == 1 || quan_data.uid == uid" style="position: fixed; bottom: 0; width: 100%; z-index: 999; background-color: #f3f3f3; ">
			<view class="d-kuan-juzhong">
				<view class="d-kuan d-clear">
					<uv-row customStyle="" :gutter="10">
						<uv-col span="2" class="pc-yincang">
							<view></view>
						</uv-col>
						<uv-col :span="kuan_shu">
							<view class="pc-neikuang-20">
								
							    <view class="d-kuan d-wenzi-16" >
							    	<uv-button 
							    		@click="jiaquan(id)" 
							    		shape="circle" 
							    		color="linear-gradient(to right, rgb(24, 216, 200), rgb(213, 51, 186))" 
							    		type="primary" 
							    		size="normal" 
							    		:text="'免费加入圈子'"
							    	>
							    	</uv-button>
							    </view>
							</view>
							
						</uv-col>
						<uv-col span="3" class="pc-yincang">
							<view></view>
						</uv-col>
				</uv-row>
		
				</view>
				
		
			</view>
		</view>
		<!--底部登录-->
		<Dweibudenglu
			ref="weibudenglu"
			:denglu_xianshi_weibu="denglu_xianshi_weibu"
			@denglu_close_get="denglu_close_get"
		>
		</Dweibudenglu>
	</view>
</template>

<script>
    import Api from '@/utils/api.js';
	import QuanApi from '@/utils/quan_api.js';
	import { getRequest,postRequest } from '@/utils/wxRequest.js';
    //引入组件 d-toubu
    import DToubu from '@/components/d-toubu/d-toubu.vue';
	import Ddaohang from '@/components/d-daohang/d-daohang.vue';
	import Dweibu from '@/components/d-weibu/d-weibu.vue';
	import Dzhifu from '@/components/d-zhifu/d-zhifu.vue';
	import NlAudioPlayer from '@/uni_modules/nl-audio-player/components/nl-audio-player/nl-audio-player.vue'
	import Dweibudenglu from '@/components/d-weibu-denglu/d-weibu-denglu.vue'
	
	
	
	export default {
		data() {
			return {
				id:'',
				title: 'Hello',
				leftNavHeight: '500rpx', // 默认高度
				
                rightColWidth: '300px', // 默认宽度
				rightColLeft: '0px', // 添加这个属性

				baseList: [
					{
						name: 'question-circle',
						title: '成员',
						yidu:1,
						kedu:2,
						gengxin:1,

					},
					{
						name: 'question-circle',
						title: '主题',
						yidu:1,
						kedu:2,
						gengxin:1,
					},
					{
						name: 'question-circle',
						title: '运营天数',
						yidu:1,
						kedu:2,
						gengxin:1,
					},
					{
						name: 'question-circle',
						title: '问答',
						yidu:1,
						kedu:2,
						gengxin:1,
					},
					
				],
				erjidata:[],
				erjiindex:'',//当前激活的二级菜单索引
				activeIndex: -1, // 当前激活的一级菜单索引
				zhishi_tuijian_data:[], // 知识推荐数据
				zhishi_daohang_list:[], // 知识导航列表
				zhishi_list:[], // 知识列表
				
				imageSize: {
        		    width: 0,
        		    height: 0
        		},
				tubiaolist: 
				['integral', 'kefuv-ermai', 'coupon', 'gift', 'scan',
					'pause-circle', 'volume-off', 'email', 'list'
				],
				denglu_xianshi:0, // 登录显示

				tiezi_list:[], // 帖子列表
					audioPlayers: {}, // 存储音频播放器引用

				currentPage: 1, //下拉加载
    			pageSize: 12, //下拉加载
    			isLoading: false, //下拉加载
    			noMoreData: false, //下拉加载
				
				kuan_shu: 7, //格大小
				swiperHeight: '250',
				gao: '20', //图片高度
				
				jiaquan_panduan:0, // 加圈判断
				jiaquan_shu:0, // 加圈数量
				quan_data:{}, // 圈子信息
				dataLoaded: false,
				quan_list:[
					{
					name: '首页',
					id:'1',
					},
					{
					name: '热门',
					id:'2',
					},
					{
					name: '热评',
					id:'3',
					},
					{
					name: '购买必知',
					id:'4',
					}

				],
				shuxing:0, // 帖子排列属性 // 0等于最新，1是热门，2是热评
				shenhe_shu:0, // 审核数量
				show: false, // 控制组件显示/隐藏
				payType: 'weixin', // 支付类型
				title: '充值', // 支付标题
				jine:0, // 充值金额
				quan_value:0,
				list_shuxing:[
					{
						id:0,
						name: '全部',
					},
					{
						id:1,
						name: '图文',
					},
					{
						id:2,
						name: '视频',
					},
					{
						id:3,
						name: '音频',
					},
					{
						id:4,
						name: '附件',
					},
					{
						id:5,
						name: '付费文章',
					},
				],
				denglu_xianshi_weibu:0, //移动显示
				statefocus:false,
				search:'', // 搜索关键词
				uid_data:{}, // 会员信息

			}
		},
		components: {
  		    DToubu,
			Ddaohang,
			Dweibu,
			Dzhifu,
			NlAudioPlayer,
			Dweibudenglu,
  		},
		mounted() {
			//var m = this.$store.state;
			//console.log('mmmm',m);
			
    	    this.setLeftNavHeight();
			this.getRightColWidth(); // 添加这行
    	    // 添加窗口大小变化监听
    	    window.addEventListener('resize', this.setLeftNavHeight);
			window.addEventListener('resize', this.getRightColWidth); // 添加窗口大小变化监听
			// 添加滚动事件监听，用于关闭音频
			window.addEventListener('scroll', this.handleScroll);
			var e = this;
			//this.onImageLoad(e);
    	},
    	beforeDestroy() {
    	    // 移除监听
    	    window.removeEventListener('resize', this.setLeftNavHeight);
			window.removeEventListener('resize', this.getRightColWidth); // 添加这行
			// 移除滚动事件监听
			window.removeEventListener('scroll', this.handleScroll);
    	},
		onShow() {
			//var m = this.$store.state;
			//console.log('12300000:', this.$store.state.memberuid);
			var e = this;
			//this.zhishi_list_api(e);
			this.zhishituijian_api();
			this.getTiezi_api(e,false);
			this.getJiaquan_panduan_api();//加圈判断
			this.getQuan_api();//圈子信息
			this.getShenhe_shu_api();//审核帖子数量
			this.getUid_api();
			this.ready();
		},
		onLoad(e) {
			// 获取URL参数
			this.id = e.id || '';
			//console.log('圈子id',this.id);
			
		},
		computed: {
		  yidenglu() {
		    return (this.$store.state.memberuid && this.$store.state.keycode) ? 1 : 0;
		  },
		  touxiang() {
		    return this.$store.state.member? this.$store.state.member.avatar : '';
		  },
		  name1() {
		    return this.$store.state.member? this.$store.state.member.name : '';
		  },
		  uid() {
		    return this.$store.state.memberuid;
		  }
		},
		onReachBottom() {
  			this.onReachBottom(); //下拉加载分页
  		},

		methods: {
			//搜索
			handleSousuo(searchValue) {
				
				this.search = searchValue;
				this.currentPage = 1;
				this.noMoreData = false;
				let data = {};
				data.search = searchValue;
				console.log('搜索关键词:', searchValue);
				// 当searchValue值变化时，直接触发API调用
				this.getTiezi_api(data, false);
			},
			ready() {
				// 由于图片较多，可以再适当的给一个延迟
				setTimeout(()=>{
					this.$refs.readMore.init();
				},1000)
			},
			//图片
			onImageLoad(e, index) {
				// 获取系统信息
				const systemInfo = uni.getSystemInfoSync();
        	    // 计算可用高度（可根据实际需求调整计算方式）
        	    const windowHeight = systemInfo.windowWidth;
				if(windowHeight >=1221){
					var gao = 30;
					
				} else {
					var gao = 0;

				}


				this.$nextTick(() => {
        		    
        		});

    		},
			getRightColWidth() {
				// 获取系统信息
				const systemInfo = uni.getSystemInfoSync();
        	    // 计算可用高度（可根据实际需求调整计算方式）
        	    const windowWidth = systemInfo.windowWidth;
				var d = this;

                this.$nextTick(() => {
				if(windowWidth >=1221){
					d.gao = 20;
					d.kuan_shu = 7;
					d.swiperHeight = '250';
				} else {
					d.gao = 10;
					d.kuan_shu = 12;
					d.swiperHeight = '120';

				}
				//console.log('窗口高度:', windowWidth);

                 const query = uni.createSelectorQuery().in(this);
                 query.select('#youbiankuan').boundingClientRect(rect => {
                   if (rect) {
                     /*this.rightColWidth = `${rect.width+20}px`;
                     console.log('右侧列宽度:', this.rightColWidth);*/
					 	this.rightColWidth = `${rect.width-80}px`;
                    	this.rightColLeft = `${rect.left}px`; // 计算左侧位置
                    	console.log('右侧列位置:', this.rightColWidth);
                   }
                 }).exec();
               });
            },

			//首页
			shouye(){
				uni.navigateTo({
					url: '/pages/index/index',
					fail: (err) => {
						console.error('跳转失败:', err)
					}
				})
			},
			// ...其他方法保持不变...
			yiji(index) {
    		  // 切换激活的一级菜单
    		  this.activeIndex = index;
    		  // 根据激活的一级菜单显示对应的二级菜单
			  if(index == 0){
				  this.erjidata = [];
			  }else{
				  this.erjidata = this.zhishi_daohang_list[index].son;
			  }
			  const data = {
				  categories:index
			  }
			  this.zhishi_list_api(data);
    		  //this.erjidata = this.zhishi_daohang_list[index].son;
			  console.log(this.erjidata);
    		},
			erji(index) {
    		  // 切换激活的二级菜单
    		  this.erjiindex = index;

			  const data = {
				  categories:index
			  }
			  this.zhishi_list_api(data);
			  //console.log(index);

    		},
			toggleErji(index) {
    		  if (this.activeIndex === index) {
    		    // 点击已激活的菜单，收起二级菜单
    		    this.activeIndex = -1;
    		    this.currentErji = [];
    		  } else {
    		    // 点击新的菜单，显示对应的二级菜单
    		    this.activeIndex = index;
    		    this.currentErji = this.zhishi_daohang_list[index].erji;
    		  }
    		},
			setLeftNavHeight() {
        	    // 获取系统信息
        	    const systemInfo = uni.getSystemInfoSync();
        	    // 计算可用高度（可根据实际需求调整计算方式）
        	    const windowHeight = systemInfo.windowHeight;
        	    const headerHeight = 70; // 头部高度估计值
        	    const calculatedHeight = windowHeight - headerHeight;
				
        	    // 设置左边导航高度
        	    this.leftNavHeight = `${calculatedHeight}px`;
        	},
			zhishi(id){
				console.log(id);
				try {
  				  uni.navigateTo({
  				    url: '/pages/zhishi/index?id='+id,
  				    fail: (err) => {
  				      console.error('跳转失败:', err)
  				    }
  				  })
  				} catch (e) {
  				  console.error('跳转异常:', e)
  				}
			},
			
			handleLoginSuccess() {
  			  this.$forceUpdate();
			  this.getUid_api();
			  this.getQuan_api();
			  this.getJiaquan_panduan_api();//加圈判断
  			},
			
			zhishi_list_api(data){
				if (!data) data = {};
				if (!data) data = {};
		  		if (!data.page) data.page = 1;
		  		if (!data.categories) data.categories = 0;
		  		if (!data.search) data.search = this.search;
				var get_data = getRequest(Api.getZhishi_list(data));
				var res;	
				get_data.then(duixin_data => {
					res = duixin_data;	
					if(res.data.code) {
						// 转换时间戳为日期格式
						var list = res.data? res.data.data : {};
						this.zhishi_list = list;	
					} else {
						/*uni.showToast({
							icon: 'none',
							title: '获取失败，请稍后重试'
						});*/
					}
				})
			},
			
			// 知识推荐 getZhishi_tuijian
			zhishituijian_api(){
				var get_data = getRequest(Api.getZhishi_tuijian());
				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						// 转换时间戳为日期格式
						//var list = res.data ? res.data.data : {};
						/*var list = res.data && res.data.data ? res.data.data : [];
        				this.haibao_data = list;*/
						this.zhishi_tuijian_data = res.data.data;
						
					} else {
						uni.showToast({
							icon: 'none',
							title: '获取失败，请稍后重试'
						});
					}
				})


			},
			denglu_fabu(){
				if(this.yidenglu == 0){
					this.denglu_xianshi = 1;
				} else {
					this.denglu_xianshi = 0;	
				}
				
				console.log('发布登录',this.denglu_xianshi);
				
			},
			// 更新判断是否登录
			handleUpdateDengluxianshi(value) {
			  this.denglu_xianshi = value;
			  console.log('关闭登录',this.denglu_xianshi);
			},
			click_suxing(e){
				
				//this.index_suxing = 0;
				let data = {};
				//全部
				//推荐
				if(e.id == 1){
					data.tupianzhi = 1;
				}
				//视频
				if(e.id == 2){
					data.shipinzhi = 1;
				}
				//音频
				if(e.id == 3){
					data.yinpinzhi = 1;
				}
				//附件
				if(e.id == 4){
					data.fujianzhi = 1;
				}
				//付费文章
				if(e.id == 5){
					data.fufeizhi = 1;
				}
				this.getTiezi_api(data, false);
			},
			// 帖子列表
			getTiezi_api(data,isLoadMore = false){
				if (!data) data = {};
				if (!data) data = {};
				if (!data.page) data.page = 1;
				//if (!data.categories) data.categories = 0;
				if (!data.search) data.search = '';
				data.categories  = this.id;
				const canshu = {
					shuxing:this.shuxing,
				}
				data.gongkai = 1;
				

				
				var get_data = getRequest(Api.getTiezi_list(data),canshu);
				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						// 转换时间戳为日期格式
						var list = res.data? res.data.data : {};
						if (isLoadMore) {
        				  // 加载更多时追加数据
        				  this.tiezi_list = [...this.tiezi_list, ...list];
        				} else {
        				  // 非加载更多时替换数据
        				  this.tiezi_list = list;
        				}	
						this.noMoreData = list.length < this.pageSize;

					} else {
						uni.showToast({
							icon: 'none',
							title: '获取失败，请稍后重试'
						});
					}
					this.isLoading = false;
				}).catch(() => {
    			  this.isLoading = false;
    			  if (isLoadMore) {
    			    this.currentPage--; // 加载失败时回退页码
    			  }
    			});


			},
			// 下拉加载更多
			onReachBottom() {
  			  if (this.isLoading || this.noMoreData) return;
  			  this.isLoading = true;
  			  this.currentPage++;
			  // 获取当前激活的分类ID
    			const currentCategoryId = this.activeIndex.id >= 0 ? this.activeIndex.id : 0;
    			

  			  const data = {
  			    page: this.currentPage,
  			    categories: currentCategoryId
  			  };
			  console.log('分页',this.activeIndex.id);
  			  this.getTiezi_api(data, true); // 添加第二个参数表示是加载更多
  			},
			// 帖子
			tiezi(cid,id){
				// 判断是否加入圈子，没有加入圈子，弹出提示加加入圈子
				//console.log('请先加入圈子000',id);
				if(this.jiaquan_panduan == 0 && this.quan_data.jiage > 0){
					if(this.quan_data.uid != this.uid){
						uni.showToast({
							icon: 'none',
							title: '付费圈子，请先加入圈子'
						});
						return;
					}
				}
				//console.log('请先加入圈子002',id);	
				try {
  				  uni.navigateTo({
  				    url: '/pages/tiezi/index?id='+id+'&cid='+cid,
  				    fail: (err) => {
  				      console.error('跳转失败:', err)
  				    }
  				  })
  				} catch (e) {
  				  console.error('跳转异常:', e)
  				}

			},
			// 返回
            fanhui() {
				
               // 获取页面栈
                 const pages = getCurrentPages();
                 // 如果页面栈长度小于等于1，说明没有上一级页面
                 if (pages.length <= 1) {
                    console.log('没有上一级页面');
                    uni.reLaunch({
                      url: '/pages/index/index'
                    });
                 } else {
                    // 有上一级页面则返回
                    uni.navigateBack({
                      delta: 1
                    });
                }
            },
			//加圈
			jiaquan(id){
				const uid = this.$store.state.memberuid;
                const keycode = this.$store.state.keycode;
				if (!uid || !keycode) {
    			    uni.showToast({
    			        title: '未登录',
    			        icon: 'none'
    			    });
					
					var pc = this.$store.state.kuan.pc;
					if(pc){
						this.denglu_xianshi = 1; //pc
					} else {
						this.denglu_xianshi_weibu = 1; //移动
					}
    			    return;
    			}
				const data = {
					id: id
				}
				var post_data = postRequest(QuanApi.postJiaquan(uid,keycode),data);
				var res;
				post_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.data && res.data.data.code==1) {
						this.jiaquan_panduan = 1;
						this.jiaquan_shu = res.data.data.data;
						
						// 提示
						uni.showToast({
							icon: 'success', //有效的 icon 值为 success, loading, none
							title: '加入成功'
						});
					} else {
						this.jiaquan_panduan = 0;
						this.jiaquan_shu = res.data.data.data;
						
						// 提示
						uni.showToast({
							icon:'success', //有效的 icon 值为 success, loading, none
							title: '退出成功'

						});
					}
				})
			},
			//加圈判断
			getJiaquan_panduan_api(){
				// 确保从 获取最新值
				const uid = this.$store.state.memberuid;
                const keycode = this.$store.state.keycode;

				// id ,cid 参数
				const data = {
					id: this.id,
				}
				
				var get_data = getRequest(QuanApi.getJiaquan_panduan(uid,keycode),data);
				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code && res.data.data.code > 2) {
						this.jiaquan_panduan = 0;
						this.jiaquan_shu = res.data.data.data;
					} else if(res.data.code && res.data.data.code == 1) {
						this.jiaquan_panduan = 1;
						this.jiaquan_shu = res.data.data.data;
					} else {
						this.jiaquan_panduan = 0;
						this.jiaquan_shu = res.data.data.data;
					}
				})
			
			},
			// 圈子信息
			getQuan_api(){
				// id ,cid 参数
				const data = {
					id: this.id,
				}
				var get_data = getRequest(QuanApi.getQuan(),data);

				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						// 转换时间戳为日期格式
						var quan_data = res.data? res.data.data[0] : [];
						this.quan_data = quan_data;
						this.dataLoaded = true;

					}
				})
			},
			fabu(id,title){
				
				getApp().globalData.currentId = id;
				getApp().globalData.title = title;

				uni.navigateTo({
					url: '/pages/fabu/index?id='+id,
					success: () => {
					  console.log('跳转成功');
					  
					},
					fail: (err) => {
					  console.error('跳转失败:', err);
					  uni.showToast({
							title: '跳转失败，请重试',
							icon: 'none'
					  });
					}
				});
			},
			// 帖子排列属性
			quan_click(index){
				this.activeIndex = index;
				var e = this;
				this.shuxing = index.index;
				// 0等于最新，1是热门，2是热评
				this.getTiezi_api(e,false);
			},
			//审核帖子数量
			getShenhe_shu_api(){
				const uid = this.$store.state.memberuid;
                const keycode = this.$store.state.keycode;
				const data = {
					id:this.id,
					cid:this.cid,
				}
				var get_data = getRequest(QuanApi.getShenhe_shu(uid,keycode),data);
				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						
						this.shenhe_shu = res.data.data;
						
					}
				})

			},
			// 审核帖子
			shenhe(){
				uni.navigateTo({
					url: '/pages/shenhe/index?cid='+this.id,

					fail: (err) => {
					  console.error('跳转失败:', err)
					}
				  })
			},
			edit_url(){
				console.log(this.id);
				uni.navigateTo({
					url: '/pages/quanzi/edit?id='+this.id,
					fail: (err) => {
					  console.error('跳转失败:', err)
					}
				  })
			},
			//个人页面
			getgeren(id){
				uni.navigateTo({
					url: '/pages/u/index?uid='+id,

					fail: (err) => {
					  console.error('跳转失败:', err)
					}
				  })
			},
			denglu_jiance(){
				// 检查是否登录（通过Vuex状态判断）
				// 检查是否登录（通过Vuex状态判断）
  				const isLoggedIn = this.$store.state.memberuid && this.$store.state.keycode;
  				if (!isLoggedIn) {
  				  // 未登录，通过ref调用子组件的登录弹窗方法
  				  //this.$refs.dToubu.dengluzhi();
				  this.denglu_xianshi = 1;
  				  uni.showToast({
  				    title: '请先登录',
  				    icon: 'none'
  				  });
  				}
  				return isLoggedIn; // 返回登录状态    			    			    			    			    			    			    			    			
			},
			goumai(id){
				const uid = this.$store.state.memberuid;
				const keycode = this.$store.state.keycode;
				if (!uid || !keycode) {
				    uni.showToast({
				        title: '未登录0',
				        icon: 'none'
				    });
					var pc = this.$store.state.kuan.pc;
					if(pc){
						this.denglu_xianshi = 1; //pc
					} else {
						this.denglu_xianshi_weibu = 1; //移动
					}
					
				    return;
				}
				// 检查是否登录（通过Vuex状态判断）
				if (!this.denglu_jiance()) return;
				// 把 this.zhishi_data.jiage 和 this.uid_data.money 化成数字，在做比较
				
				var jiage = Number(this.quan_data.jiage);
				var money = Number(this.uid_data.money.money); // 余额判断
				if(jiage > money){
					// 购买
					uni.showToast({
					  title: '余额不足,请充值',
					  icon: 'none'
					});
					//弹出充值页面
					this.show = true;
					// 充值金额
					this.jine = jiage;
				} else {
					//弹出确认购买按钮
					uni.showModal({
					  title: '确认购买',
					  content: '支付' + jiage + '元？',
					  success: (res) => {
					    if (res.confirm) {
					      console.log('用户点击了确认购买');
					      // 执行购买操作
					      this.postQuan_buy(id);
					    } else if (res.cancel) {
					      console.log('用户点击了取消购买');
					      // 不执行任何操作
					    }
					  }
					});
				}

			},
			postQuan_buy(id){
				//购买扣除费用
				const uid = this.$store.state.memberuid;
				const code = this.$store.state.keycode;
				var datas = "is_ajax=1&data[id]="+id;

				var post_data = postRequest(QuanApi.postGoumai(uid,code,id),datas);
				var res;
				post_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						//成功
						uni.showToast({
						  title: '购买成功',
						  icon: 'success' //成功图标
						});
						// 更新数据
						this.getQuan_api();
						this.getUid_api(); //更新个人信息
						this.getJiaquan_panduan_api();//加圈判断
						//this.getxiangqing_api(); //更新信息
						// 更新个人信息 - 调用d-toubu组件的get_uid方法
						if (this.$refs.dToubu && typeof this.$refs.dToubu.get_uid === 'function') {
						  this.$refs.dToubu.get_uid();
						}
						// 强制更新Vuex store中的余额数据
						if (res.data.data && res.data.data.money !== undefined) {
						  this.$store.commit('updateMemberMoney', res.data.data.money);
						}
					} else {
						uni.showToast({
						  title: res.data.msg,
						  icon: 'error' //失败图标
						});
					}
				})
				
			},
			handleLogout() {
			    // 用户退出时关闭阅读界面
			    this.yuedu = false;
			    // 停止并销毁音频
			    //this.clearAllAudio();
			    this.getQuan_api();
				this.getJiaquan_panduan_api();//加圈判断
			},
			// 获取个人信息
			// 存储音频播放器引用
			setAudioRef(el, index) {
				if (!this.audioPlayers) {
					this.audioPlayers = {};
				}
				if (el) {
					this.audioPlayers[index] = el;
				}
			},

			// 音频开始播放时的处理
			onAudioPlay(currentIndex) {
				// 先关闭所有其他音频
				this.clearAllAudio();
				// 短暂延迟后，确保其他音频都已停止
				setTimeout(() => {
					// 然后尝试重新播放当前点击的音频（如果因为clearAllAudio而被暂停）
					if (this.audioPlayers && this.audioPlayers[currentIndex]) {
						try {
							const currentAudio = this.audioPlayers[currentIndex];
							if (typeof currentAudio.play === 'function') {
								currentAudio.play();
							}
						} catch (e) {
							console.log('重新播放当前音频失败:', e);
						}
					}
				}, 100);
			},

			// 关闭页面上所有的音频
			clearAllAudio() {
				try {
					// 优先使用audioPlayers中的引用（Vue组件方式）
					if (this.audioPlayers && typeof this.audioPlayers === 'object') {
						Object.keys(this.audioPlayers).forEach(key => {
							const audioPlayer = this.audioPlayers[key];
							if (audioPlayer) {
								// 尝试使用Vue组件方式调用pause方法
								if (typeof audioPlayer.pause === 'function') {
									try {
										audioPlayer.pause();
									} catch (e) {
										console.log('组件引用暂停失败:', e);
									}
								}
								
								// 尝试获取音频上下文并关闭
								if (typeof audioPlayer.getAudioContext === 'function') {
									try {
										const audioCtx = audioPlayer.getAudioContext();
										if (audioCtx && typeof audioCtx.stop === 'function') {
											audioCtx.stop();
										}
										if (audioCtx && typeof audioCtx.destroy === 'function') {
											audioCtx.destroy();
										}
									} catch (e) {
										console.log('关闭音频上下文失败:', e);
									}
								}
							}
						});
					}
				} catch (e) {
					console.error('关闭音频失败:', e);
				}
			},

			// 处理滚动事件，关闭所有音频
			handleScroll() {
				this.clearAllAudio();
			},

			getUid_api(){
				const uid = this.$store.state.memberuid;
			    const keycode = this.$store.state.keycode;
				//判断  uid 和 keycode 同时存在，才执行下一步
				if(!uid || !keycode) {
					
					return;
				}
			
				var get_data = getRequest(Api.getUID(uid,keycode));
				var res;	
				get_data.then(duixin_data => {
					res = duixin_data;	
					if(res.data.code) {
						// 转换时间戳为日期格式
						var list = res.data ? res.data.data : {};
						
						this.uid_data = list;	
						// 判断是否还有更多数据
					}
				})
			
			},
            denglu_close_get(){
            	//console.log('关闭登录');
            	this.denglu_xianshi_weibu = 0;
            },
            denglu_weibu(){
            	this.denglu_xianshi_weibu = 1;
            }









		}
	}
</script>

<style>

	.content {
		
		
		display: flex;
		flex-direction: column;
		/*align-items: center;*/
		
		background-color: #f3f3f3;
		
		margin-bottom: 70px;
		
		box-sizing: border-box;
		overflow-x: hidden;
		

	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	/* 屏幕宽度大于786px时隐藏uni-page-head */
    @media (min-width: 786px) {
        uni-page-head {
            display: none !important;
            opacity: 0 !important;
            height: 0 !important;
            visibility: hidden !important;
        }
    }
	/*.d-daohang{
		
		width: 600rpx;
	}*/
	/* 添加在style部分 */
	.d-daohang-zuo {
    position: fixed;
    left: 0;
    
    width: 180rpx;
    height: calc(100vh - 70rpx);
    background: #f5f5f5;
    z-index: 100;
	box-shadow: 2px 0 5px rgba(177, 177, 177, 0.1);
  }
  
  .d-daohang-you {
    position: fixed;
    left: 180rpx;
    
    width: 180rpx;
    height: calc(100vh - 70rpx);
    background: #fff;
    z-index: 100;
    box-shadow: 2px 0 5px rgba(0,0,0,0.1);
  }
   
  .d-erji-item {
    height: 60rpx;
    line-height: 60rpx;
    padding: 0 20rpx;
   /* border-bottom: 1px solid #f0f0f0;*/
  }
  
  .d-erji-item:active {
    background: #f5f5f5;
  }
  .you-guding {
	position: fixed;
	top: 0; /* 根据头部高度调整 */
	/*box-shadow: -2px 0 5px rgba(0,0,0,0.1);*/
	transition: all 0.3s ease;
}
/* 大于786px时的样式 */
@media screen and (min-width: 1024px) {
	.d-bianhua-10 {
		padding: 30px;
	}
	.pc-zuo-520 {
		margin-left: 520rpx;
		
	}
	.you-guding {
		position: fixed;
			
		top: 60px; /* 根据头部高度调整 */
		/*box-shadow: -2px 0 5px rgba(0,0,0,0.1);*/
		transition: all 0.3s ease;
	}
		
	
}
.uv-border-right[data-v-0657340f] {
    border-right-width: 0.5px !important;
    border-color: #ffffff26 !important;
    border-right-style: solid;
}
	
</style>
